body{margin:0;user-select:none;width:1920px;height:1080px;overflow:hidden;transform-origin:left top;position:absolute}#app{display:flex;flex-direction:column;position:relative}#app,.page{width:100%;height:100%}.page{display:none;position:absolute;top:0;left:0;z-index:1}.page.active{display:flex}.home-container{display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;width:100%;height:100%;min-height:0;position:relative;box-sizing:border-box;background-image:url(../assets/bg00.95eb3972.png);background-size:cover;background-position:50%;background-repeat:no-repeat}.logo{position:absolute;top:40px;right:50px;z-index:10}.main-title-img{object-fit:contain}.mode-selection{display:grid;grid-template-columns:1fr 1fr;gap:20px;width:1400px;margin-bottom:80px;z-index:5;align-items:center;justify-items:center}.mode-button{background:none;border:none;cursor:pointer;padding:0;transition:transform .2s;display:flex;align-items:center;justify-content:center;width:100%;height:100%;max-height:50vh;min-width:0;min-height:0}.mode-button:hover{transform:scale(1.05)}.mode-button:active{transform:scale(.98);opacity:.8}.mode-button img{display:block;width:100%;height:100%;max-width:100%;max-height:50vh}.instruction-img,.mode-button img{object-fit:contain}.still-life-container{display:grid;grid-template-rows:7fr 3fr;gap:20px;width:100%;height:100%;min-height:0;padding:20px;box-sizing:border-box;position:relative;background-color:#fef5f6;background-image:url(../assets/bg.7ff5cbe1.png);background-size:cover;background-position:50%;background-repeat:no-repeat}.top-buttons{position:absolute;top:30px;left:20px;justify-content:space-between;align-items:flex-start;gap:10px;z-index:10}.icon-button,.top-buttons{display:flex;flex-direction:column}.icon-button{width:80px;background:none;border:none;cursor:pointer;padding:0;transition:transform .2s,opacity .2s;align-items:center;justify-content:center;filter:drop-shadow(0 4px 2px rgba(0,0,0,.2))}.icon-button:hover{transform:scale(1.05);opacity:.9}.icon-button:active{transform:scale(.95);opacity:.8}.icon-button img{display:block;width:50px;height:50px}#btn-back:hover{transform:scale(1.05)}#btn-back:active{transform:scale(.95)}#btn-help:hover{transform:scale(1.05)}#btn-help:active{transform:scale(.95)}.preview-area{width:100%;height:100%;min-height:0;background-color:#ffe6e6;border:5px solid #fff;border-radius:80px;position:relative;overflow:hidden;padding:24px;box-sizing:border-box;display:flex;align-items:center;justify-content:center}.preview-area img{display:block;width:100%;height:100%;object-fit:contain}.action-buttons{position:absolute;bottom:25px;right:25px;justify-content:flex-end;gap:10px;z-index:10}.action-button,.action-buttons{display:flex;align-items:center}.action-button{background:none;border:none;cursor:pointer;padding:0;transition:transform .2s,opacity .2s;justify-content:center;filter:drop-shadow(0 4px 2px rgba(0,0,0,.2))}.action-button:hover{transform:scale(1.05);opacity:.9}.action-button:active{transform:scale(.95);opacity:.8}.action-button img{display:block;width:auto}.control-panel{display:grid;grid-template-columns:3fr 2fr}.selection-panel{display:flex;flex-direction:column;align-items:flex-start}.panel-title{width:auto;object-fit:contain;display:block;margin-bottom:15px}.selection-items{display:flex;height:100%;gap:70px;flex-wrap:nowrap;justify-content:space-between;padding:20px 50px;background-color:hsla(0,0%,100%,.5);border-radius:100px}.selection-item{flex:1;min-width:0;background:transparent;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;transition:all .2s;box-sizing:border-box;border:none;padding:0}.selection-item:hover{transform:scale(1.05)}.selection-item.selected{opacity:1}.selection-item img{aspect-ratio:1;height:130px;border-radius:50%;border:5px solid #fff;object-fit:cover;transition:all .2s}.selection-item.selected img{border-color:#bfbfbf;background:hsla(0,0%,100%,.1)}.selection-item:hover img{border-color:hsla(0,0%,100%,.9)}.selection-item-text{color:#333;font-size:20px;font-weight:500;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;line-height:1.2}.settings-panel{display:grid;grid-template-rows:1fr 1fr;gap:20px}.light-section,.viewpoint-section{display:grid;grid-template-rows:1fr 1fr;gap:10px;width:100%}.section-title{width:146px;display:block;object-fit:contain}.light-buttons,.viewpoint-buttons{display:flex;gap:12px;justify-content:flex-start}.light-buttons .img-btn,.viewpoint-buttons .img-btn{flex:0 1 auto;min-width:0;display:flex;align-items:center;justify-content:center}.light-buttons .img-btn img,.viewpoint-buttons .img-btn img{object-fit:contain}.img-btn{background:none;border:none;cursor:pointer;padding:0;transition:transform .2s,opacity .2s;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 3px 2px rgba(0,0,0,.2))}.img-btn:hover{transform:scale(1.05);opacity:.9}.img-btn:active{transform:scale(.95);opacity:.8}.img-btn img{display:block;width:auto;height:auto;transition:opacity .2s}.img-btn.selected{opacity:1;filter:drop-shadow(0 3px 2px rgba(0,0,0,.3))}.img-btn.selected img{filter:brightness(1.05)}.button{cursor:pointer;user-select:none}.button:hover{opacity:.8}.button:active{opacity:.6}.instruction-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);z-index:1000;align-items:center;justify-content:center}.instruction-modal.active{display:flex}.instruction-modal-content{max-width:90vw;max-height:90vh}.instruction-modal-content,.instruction-window-wrapper{position:relative;display:flex;align-items:center;justify-content:center;width:auto;height:auto}.instruction-window-bg{position:relative;width:auto;height:auto;max-width:90vw;max-height:90vh;object-fit:contain;z-index:1;display:block}.instruction-content-wrapper{position:absolute;top:55%;left:50%;transform:translate(-50%,-50%);z-index:2;display:flex;align-items:center;justify-content:center;width:90%;height:90%}.instruction-content-img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;display:block}.instruction-close-btn{position:absolute;top:130px;right:25px;background:none;border:none;cursor:pointer;padding:0;z-index:3;transition:transform .2s,opacity .2s;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));width:72px;height:72px}.instruction-close-btn:hover{transform:scale(1.1);opacity:.8}.instruction-close-btn:active{transform:scale(.95);opacity:.6}.instruction-close-btn img{display:block;width:60px;height:60px;object-fit:contain}